سئو ؛ بهینه سازی و طراحی سایت

ساخت وبلاگ

آخرین مطالب

امکانات وب

چگونه خطای Optimize CSS Delivery را حل کنیم؟

یکی از دلایل دیگری که PageSpeed Insights ممکن است فعال شود هنگامی است که لود صفحه با تاخیر مواجه شود که دلیل آن این است که stylesheet خارجی مسدود شده است.

 

چگونه خطای Optimize CSS Delivery را حل کنیم؟

مروری بر Optimize CSS Delivery
هنگامی که مرورگر می خواهد صفحه ای از سایتی را باز کند ابتدا Layout و سبک ها را پردازش می کند و سپس اقدام به باز کردن صفحه مورد نظر می کند و گاهی پردازش و بررسی stylesheet خارجی امکان دارد سبب تاخیر در باز شدن صفحه گردد.

 

تبلیغات درون متنی/

اگر تمایل دارید برای شرکت خود اقدام به طراحی سایت ارزان کنید پیشنهاد می کنم ابتدا مقالات مربوط به تفاوت   طراحی سایت فروشگاهی  و  طراحی سایت شرکتی را مطالعه کنید. من به شما پیشنهاد می کنم خدمات طراحی سایت پیام آوا را برای این کار نگاه کنید. شرکت پیام آوا بهترین و با کیفیت ترین خدمات طراحی سایت را در قالب طراحی سایت ارزان و مقرون به صرفه به شما ارائه می کند.

تبلیغات درون متنی

پیشنهادات برای Optimize CSS Delivery
در صورتی که فایل stylesheet خارجی فایل کوچکی باشد برای ازبین بردن تاخیر بهتر است از روش Inling استفاده کنید و در صورتی که فایل stylesheet خارجی بزرگ است بهتر است از این روش استفاده نشود چون امکان دارد PageSpeed Insights اخطار دهد که قسمت بالای صفحه ی تان بیش از اندازه بزرگ می باشد.
در زیر مثالی از Inline آوردیم:

<html>
<head>
<link rel="stylesheet" href="box.css">
</head>
<body>
<div class="box1 box2 box3 ">
</div>
</body>
</html>

حال فایل box.css به صورت زیر است:

.box1 {width: 100px; height: 100px; background-color: yellow;}
.box2 { width: 100px; height: 100px; background-color: green;}
.box3 { width: 100px; height: 100px; background-color: blue;}

حال کدها را می توانید به صورت Inline در آوریم:

<html>
<head>
<style>
.box1 {width: 100px; height: 100px; background-color: yellow;}
</style>
</head>
<body>
<div class="box1">
</div>
< script>
var cb = function() {
var l = document.createElement('link'); l.rel = 'stylesheet';
l.href = 'small.css';
var h = document.getElementsByTagName('head')[0]; h.parentNode.insertBefore(l, h);
};
var raf = requestAnimationFrame || mozRequestAnimationFrame || webkitRequestAnimationFrame || msRequestAnimationFrame;
if (raf) raf(cb);
else window.addEventListener('load', cb);
</script>
</body>
</html>


در بالا استایل های ساختن سبک صفحه اول به شکل Inline قرار دادیم فایل small.css بطور کامل بارگذاری شده و بر روی صفحه اعمال می شود.

از Inline کردن URL های داده های بزرگ جلوگیری نمایید
می توانید URL های داده های کوچک در Css را Inline کنید ولی از Inline کردن داده های بزرگ در Css جلوگیری نمایید چون سبب کاهش سرعت لود صفحات سایت می شود.

از Inline کردن خصوصیات Css جلوگیری نمایید
برای جلوگیری از ایجاد کدهای اضافی خصوصیات Css را در html ، Inline نکنید و همچنین Css inline توسط خط مشی امنیتی محتوا (CSP) مسدود شده است.

تبلیغات میان متنی

سئو سایت برای موتورهای جست و جو و همچنین  تبلیغات گوگل  از جمله مهمترین روش ها برای بیشتر دیده شدن سایت شما به حساب می آید. شرکت پیام آوا خدمات طراحی سایت تهران و سئو را با مناسب ترین قیمت به شما ارائه می دهد. بازاریابی و تبلیغات به رکن اساسی جامعه امروز ما تبدیل شده است.

تبلیغات میان متنی

سئو ؛ بهینه سازی و طراحی سایت...
ما را در سایت سئو ؛ بهینه سازی و طراحی سایت دنبال می کنید

برچسب : نویسنده : پوریا بازدید : 307 تاريخ : دوشنبه 26 اسفند 1398 ساعت: 15:19

آرشیو مطالب

پيوندهای روزانه

لینک دوستان

خبرنامه